<template>
	<div class="sw_section_container">
		<div class="sw_query_form" v-if="$isHasAuth(topFrames)">
			<el-form size="small" inline>
				<template v-if="$isHasAuth(topButton)">
					<el-form-item>
						<el-date-picker v-model="timeRanges" v-bind="dateConfig"></el-date-picker>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" icon="el-icon-search" @click="queryTableData">查询</el-button>
					</el-form-item>
					<el-form-item>
						<el-button icon="el-icon-refresh-left" @click="handleResetQuery">重置</el-button>
					</el-form-item>
				</template>
				<el-form-item v-hasPermi="'f0503a671d854984819ce81e4b6bcb54'">
					<el-button type="warning" icon="el-icon-upload2" @click="handleExportData">导出</el-button>
				</el-form-item>
			</el-form>
		</div>
		<div class="sw_table_container">
			<el-table size="medium" :data="tableData" stripe height="100%" class="index_table_wrapper" @selection-change="handleSelectionChange">
				<el-table-column type="selection" width="42"></el-table-column>
				<el-table-column prop="startTime" label="开始时间" min-width="110"></el-table-column>
				<el-table-column prop="endTime" label="结束时间" min-width="110"></el-table-column>
				<el-table-column prop="filed2" label="课题名称" min-width="240"></el-table-column>
				<el-table-column prop="headName" label="实验PI" min-width="100"></el-table-column>
				<el-table-column prop="expName" label="实验站" min-width="120"></el-table-column>
				<el-table-column prop="room" label="房间" min-width="100"></el-table-column>
				<el-table-column prop="userName" label="用户" min-width="120"></el-table-column>
				<el-table-column prop="source" label="用户单位" min-width="150"></el-table-column>
				<el-table-column prop="machineHour" label="实验机时" min-width="100"></el-table-column>
				<el-table-column label="液氦预约量" min-width="100" :formatter="returnOrderCount"></el-table-column>
				<el-table-column label="液氦审批量" min-width="100" :formatter="returnAuditCount"></el-table-column>
			</el-table>
		</div>
		<sw-pagination :total="dataCount" :page.sync="queryData.page" :limit.sync="queryData.limit" @change="queryTableData"></sw-pagination>
	</div>
</template>

<script>
import mixins from '../mixins';
import { queryPageList } from '@/api/business/tbPiStat';
export default {
	mixins: [mixins],
	data() {
		return {
			dataCount: 0,
			checkedData: []
		};
	},
	computed: {
		topButton() {
			return ['87a630e65d9d49c39eec37e1e0b66e8d'];
		},
		topFrames() {
			return [...this.topButton, 'f0503a671d854984819ce81e4b6bcb54'];
		}
	},
	watch: {
		timeRanges(data) {
			if (!data) {
				this.$delete(this.queryData, 'startTime1');
				this.$delete(this.queryData, 'endTime1');
			} else {
				this.$set(this.queryData, 'startTime1', data[0]);
				this.$set(this.queryData, 'endTime1', data[1]);
			}
		}
	},
	mounted() {
		this.handleResetQuery();
	},
	methods: {
		//获取课题列表数据
		async getTableData() {
			let params = { ...this.queryData, isSave: '1', type: '2' };
			let result = await queryPageList(params).then((res) => res.data);
			if (result.code === '0') {
				this.dataCount = parseInt(result.count);
				this.tableData = result.data || [];
			}
		},

		//查询列表数据
		queryTableData() {
			this.loading = true;
			this.getTableData();
		},

		//重置查询
		handleResetQuery() {
			this.queryData = { page: 1, limit: 15 };
			this.timeRanges = null;
			this.$nextTick(() => {
				this.queryTableData();
			});
		},

		//返回预约量
		returnOrderCount(data) {
			return `${data.filed1}L`;
		},

		//返回审核量
		returnAuditCount(data) {
			return `${data.filed4}L`;
		},

		handleSelectionChange(selection) {
			this.checkedData = [...selection];
		},

		//导出数据
		handleExportData() {
			let params = {};
			if (this.checkedData.length !== 0) {
				params['ids'] = this.checkedData.map((n) => n.id).join();
			} else {
				params = { ...this.queryData };
				delete params.page;
				delete params.limit;
			}
			window.location.href = `${window.baseUrl}tbPiStat/export${this.$objectToQuery(params)}`;
		}
	}
};
</script>

<style scoped></style>
